<%@include file="/WEB-INF/common/taglibs.jsp"%>
<script type="text/javascript" src="${ctx}/resources/js/datatable-query.js"></script>
<div class="row-fluid">
<div class="span12">
<div class="box gradient">
<div class="title">
<h4><span>NBO Enquiry</span></h4>
<a href="#" class="minimize">Minimize</a></div>
<div class="content scrollable clearfix">
<table class="ajaxTable display table table-bordered">
	<thead>
		<tr>
			<th>Name</th>
			<th>Email</th>
			<th>Phone</th>
			<th>Topic</th>
			<th>Subject</th>
			<th>Message</th>
		</tr>
	</thead>
</table>
</div>
</div>

</div>
</div>
<script type="text/javascript">

var render = false;
var oTime = "";
var oTable;
$(document).ready(function () {
 	oTable = $('.ajaxTable').dataTable({
		"bLengthChange": true,
		"sAjaxSource": '${ctx}/nbo-enquiry/',
		"fnInitComplete": function (oSettings, json) { }
	});
	var name = $("<input>").attr({
		type: "text",
		field: "message",
		op: "cn",
		placeholder: "Message",
		class: "filterdata"
	});
	var searchLabel = $("<label>").html("Search:").css("display", "inline");
	var filterDiv = $("<div>").addClass("dataTables_filter").append(searchLabel).append(name);
	$('.dataTables_wrapper').prepend(filterDiv);

	
	johnny.resetFilter($('.reset'));

	$(".datepickerlazy").datepicker({
		dateFormat: 'yy-mm-dd',
		onSelect: function () {
			updateGrid();
		}
	}).keydown(function (event) {
		if (event.keyCode == 8) { $(".datepickerlazy").val(""); }
		else { event.preventDefault(); }
	});

	$(".filterdata").keyup(function () {
		updateGrid();
	});
 


	
});
function updateGrid() {
	window.clearTimeout(oTime);
	oTime = setTimeout(function () { oTable.fnDraw(); }, 500);
}

var columnHeader = ['name', 'email', 'phone', 'topic', 'subject', 'message'];
var QueryData = function (aoData) {
	return johnny.initQueryData(aoData, columnHeader);
}

var DataTableForm = function (json, echo) {
	var dataArray = new Array();
	for (var i = 0; i < json.result.length; i++) {
		var subArray = new Array();
		subArray.push(json.result[i].name);
		subArray.push(json.result[i].email);
		subArray.push(json.result[i].phone);
		subArray.push(json.result[i].topic);
		subArray.push(json.result[i].subject);
		subArray.push(json.result[i].message);
 		dataArray.push(subArray);
	}
	return {
		sEcho: echo,
		iTotalRecords: json.totalCount,
		iTotalDisplayRecords: json.totalCount,
		aaData: dataArray
	};
}
</script>